class Details{
    constructor(){
        this.cont = document.querySelector(".container");
        this.url = "http://localhost/dist/static/alldata.json";
        this.load();
        this.getId();
    }
    getId(){
        this.id = location.search.slice(1).split("=")[1];
    }
    load(){
        ajax({
            url:this.url
        }).then((res)=>{
            this.res = JSON.parse(res);
            this.display();
			this.addEvent();
        })
    }
    display(){
        this.res.forEach(val => {
            var str = "";
            if(val.goodsId === this.id){
                str += `
                <div class="leftBox">
					<img src="${val.img}" goodsId="${val.goodsId}" />
					<span></span>
				</div>
				<div class="rightBbox">
					<img src="${val.img}"/>
				</div>
				<ul class="list">
					${this.create(val.smallImg)}
				</ul>
				<div class="details">
					<h3>${val.name}</h3>
					<div class="promotion">
						<p>阅读季大促</p>
						<div class="time"><p>活动时间：3月24日-5月30日</p></div>
					</div>
					<div class="message">
						<p>定价：576</p>
						<p>现价：<span>${val.price}</span></p>
						<p>活动促销：阅读季大促 续订优惠</p>
					</div>
					<div class="buy">
						<div class="addCar"><p class="ap">加入购物车</p></div>
						<div class="seeCar"><a>查看购物车</a></div>
					</div>
				</div>
				`;
				this.cont.innerHTML = str;
				new Magnifier;		//页面渲染之后开启放大镜功能
				new GoodsList;
            }
        });
    }
    create(arr){
    	let str = "";
    	for(let i=0;i<arr.length;i++){
    		str += "<li><img src=" + arr[i] + " /></li>"
    	}
    	return str;
    }
    addEvent(){
    	//判断是否登录
    	this.cont.onclick = function(eve){
    		var e = eve || window.event;
    		var tar = e.target || e.srcElement;
    		if(tar.className == "ap"){
		    	if(!sessionStorage.getItem("userMsg")){
					location.href = "login.html";
				}
    		}
    		if(tar.tagName == "A"){
		    	if(sessionStorage.getItem("userMsg")){
					location.href = "car.html";
				}else{
					location.href = "login.html";
				}
    		}
    	}
    }
}

new Details;

//